<template>
  <j-modal :title="title" :width="700" :visible="visible" :confirmLoading="loading" switchFullscreen
    @cancel="handleCancel" @ok="handleOk">
    <a-form-model ref="ruleForm" :rules="rules" :model="form" :label-col="{ span: 4 }" :wrapper-col="{ span: 18 }">
      <template v-if="isUroscopy">
        <a-form-model-item label="被检测人" prop="realName">
          <a-input v-model="form.realName" placeholder="请输入" :disabled="isDisabled" />
        </a-form-model-item>
        <a-form-model-item label="身份证号" prop="realName">
          <a-input v-model="form.identityCard" placeholder="请输入" :disabled="isDisabled" />
        </a-form-model-item>
        <a-form-model-item label="检测类型" prop="realName">
          <a-select v-model="form.urineType" :disabled="isDisabled">
            <a-select-option value="1">常规尿液检测</a-select-option>
            <a-select-option value="2">突击尿液检测</a-select-option>
          </a-select>
        </a-form-model-item>
        <a-form-model-item label="检测次数" prop="realName">
          <a-input v-model="form.detectNum" :disabled="isDisabled" />
        </a-form-model-item>
        <a-form-model-item label="检测时间" prop="actualDetectTime">
          <a-date-picker v-model="form.actualDetectTime" style="width:100%;" show-time valueFormat="YYYY-MM-DD HH:mm:ss"
            placeholder="请选择" />
        </a-form-model-item>
        <a-form-model-item label="检测结果" prop="detectResult">
          <a-radio-group v-model="form.detectResult" name="detectResult" @change="onChange">
            <a-radio value="1">阴性</a-radio>
            <a-radio value="2">阳性</a-radio>
          </a-radio-group>
        </a-form-model-item>
      </template>
      <template v-else>
        <a-form-model-item label="检测时间" prop="recheckResultTime">
          <a-date-picker v-model="form.recheckResultTime" style="width:100%;" show-time
            valueFormat="YYYY-MM-DD HH:mm:ss" placeholder="请选择" />
        </a-form-model-item>
        <a-form-model-item label="检测结果" prop="recheckResult">
          <a-radio-group v-model="form.recheckResult" name="detectResult" @change="onChange">
            <a-radio value="1">阴性</a-radio>
            <a-radio value="2">阳性</a-radio>
          </a-radio-group>
        </a-form-model-item>
      </template>
      <a-form-model-item v-if="isUroscopy" label="检测报告" prop="file">
        <j-upload v-model="form.file" :number="1"></j-upload>
        <p>支持扩展名：.jpg .png .pdf</p>
        <a-tooltip placement="rightBottom" style="position: absolute;left: 125px;top: 13px;z-index: 1000;"
          :overlayStyle="{ minWidth: `300px`, maxWidth: `400px` }">
          <template slot="title">
            <div>手持尿检板拍照存档，并在检测报告中签名确认，加按手印存档</div>
          </template>
          <a-icon type="question-circle" />
        </a-tooltip>
      </a-form-model-item>
      <a-form-model-item v-else label="检测报告" prop="recheckResultFile">
        <j-upload v-model="form.recheckResultFile" :number="1"></j-upload>
        <p>支持扩展名：.jpg .png .pdf</p>
      </a-form-model-item>
      <a-form-model-item label="处置文档" class="item2" v-if="isPositive">
        <p>社区戒毒社区康复人员违法/违规行为报告.pdf</p>
        <div class="box">
          <!-- <a-button @click="onView(record)" type="link" style="padding: 0">预览</a-button>
          <a-divider type="vertical" /> -->
          <a-button @click="onDownLoad()" type="link" style="padding: 0">下载</a-button>
        </div>
      </a-form-model-item>
      <a-form-model-item label="处置文档上传" v-if="isPositive" prop="dispositionFile">
        <j-upload v-model="form.dispositionFile" :number="1"></j-upload>
        <p>支持扩展名：.jpg .png .pdf</p>
        <a-tooltip placement="rightBottom" style="position: absolute;left: 125px;top: 13px;z-index: 1000;"
          :overlayStyle="{ minWidth: `300px`, maxWidth: `400px` }">
          <template slot="title">
            <div>请将处置文档下载签字盖章后上传</div>
          </template>
          <a-icon type="question-circle" />
        </a-tooltip>
      </a-form-model-item>
      <a-form-model-item class="sItem" label="通知公安机关" v-if="isPositive">
        <a-switch @change="onSwitchChange" />
      </a-form-model-item>
      <a-form-model-item label="通知单位" v-if="isPositive && isPolice" prop="noticeDepartmentId">
        <a-input v-model="form.noticeDepartmentId" placeholder="请输入" />
      </a-form-model-item>
      <a-form-model-item label="通知内容" v-if="isPositive && isPolice" prop="noticeContent">
        <a-textarea v-model="form.noticeContent" placeholder="请输入" :auto-size="{ minRows: 4, maxRows: 6 }" />
      </a-form-model-item>
      <template v-if="isShow">
        <p class="pt">逾期信息（必填） <a-tooltip placement="rightBottom"
            :overlayStyle="{ minWidth: `300px`, maxWidth: `400px` }">
            <template slot="title">
              <div>该访谈已逾期，请填写以下逾期信息提交审批</div>
            </template>
            <a-icon type="question-circle" />
          </a-tooltip>
        </p>
        <a-row>
          <a-col :span="24">
            <a-form-model-item label="逾期原因" prop="overdueReason">
              <a-select v-model="form.overdueReason" placeholder="请选择">
                <a-select-option value="0">
                  已访谈忘记录入
                </a-select-option>
                <a-select-option value="1">
                  其他
                </a-select-option>
              </a-select>
            </a-form-model-item>
          </a-col>
          <a-col :span="24">
            <a-form-model-item label="原因说明" prop="overdueReasonExplain">
              <a-textarea v-model="form.overdueReasonExplain" placeholder="请输入至少五个字符"
                :auto-size="{ minRows: 4, maxRows: 6 }" />
            </a-form-model-item>
          </a-col>
        </a-row>
        <a-row>
          <a-col :span="24">
            <a-form-model-item label="附件">
              <j-upload v-model="form.overdueFile" :number="1"></j-upload>
              <p>支持扩展名：.jpg .png .pdf</p>
            </a-form-model-item>
          </a-col>
        </a-row>
      </template>
    </a-form-model>
  </j-modal>
</template>
<script>
import * as uroscopyApi from '@/api/sjsk/check/uroscopy.js'
export default {
  props: ['title', 'isUroscopy'],
  name: 'AddModal',
  data() {
    return {
      visible: false,
      form: {},
      rules: {
        realName: [{ required: true, message: '请选择' }],
        identityCard: [{ required: true, message: '请输入' }],
        urineType: [{ required: true, message: '请选择' }],
        detectNum: [{ required: true, message: '请输入' }],
        actualDetectTime: [{ required: true, message: '请选择' }],
        detectResult: [{ required: true, message: '请选择' }],
        file: [{ required: true, message: '请选择' }],
        recheckResultTime: [{ required: true, message: '请选择' }],
        recheckResult: [{ required: true, message: '请选择' }],
        recheckResultFile: [{ required: true, message: '请选择' }],
        dispositionFile: [{ required: true, message: '请选择' }],
        noticeDepartmentId: [{ required: true, message: '请选择' }],
        noticeContent: [{ required: true, message: '请选择' }],
        overdueReason: [{ required: true, message: '请选择' }],
        overdueReasonExplain: [{ required: true, message: '请输入' }],
      },
      startValue: undefined,
      isPositive: false,
      isPolice: false,
      isDisabled: false,
      loading: false,
      isShow: false,
      rqUrl: ""
    }
  },
  async created() {
  },
  methods: {
    show(record) {
      this.visible = true
      this.isDisabled = true
      this.isPositive = false
      this.isPolice = false
      if (this.isUroscopy) {
        this.form = {
          id: record.id,
          sjskPersonId: record.sjskPersonId,
          realName: record.realName,
          identityCard: record.identityCard,
          urineType: record.urineType.toString(),
          // detectNum: record.detectNum
          detectNum: "第" + record.detectNum + "次"
        }
      } else {
        this.form = {
          id: record.id,
          sjskPersonId: record.sjskPersonId,
          recheckStatus: record.recheckStatus, //发检的司法结果提交需要
        }
      }
      console.log(this.form)
      if (record.status == 5) { //已逾期
        this.isShow = true
      } else {
        this.isShow = false
      }
    },
    onDownLoad() {
      window.open(this.rqUrl, "_blank")
    },
    onChange(e) {
      if (e.target.value == '2') {
        this.isPositive = true
        this.getRqUrl()
      } else {
        this.isPositive = false
        this.isPolice = false
      }
      console.log('radio checked', e.target.value);
    },
    onSwitchChange(e) {
      console.log(e);
      if (e) {
        this.isPolice = true
        this.form.isNoticePolice = 1
      } else {
        this.isPolice = false
        this.form.isNoticePolice = 2
      }
    },
    getRqUrl() {
      //type类型（1-因阳性违法；2-因取消超过三次违法）
      uroscopyApi.wfwgxwbg({ type: 1, urineId: this.form.id }).then(res => {
        if (res.success) {
          if (res.success) {
            this.rqUrl = res.result
          } else {
            this.$message.warning("违法/违规行为报告没正常加载。")
          }

        }
      })
    },
    handleCancel() {
      this.visible = false
    },
    handleOk() {
      this.form.detectNum = this.form.detectNum.substring(1, this.form.detectNum.length - 1) //截取数字字符,即次数
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          this.loading = true
          uroscopyApi.inputUrine(this.form).then(res => {
            if (res.success) {
              this.$message.success(res.message)
              this.$emit('ok');
              this.visible = false
              this.loading = false
            } else {
              this.loading = false
              this.$message.warn(res.message)
            }
          })
            .catch(e => {
              this.loading = false
              this.$message.warn('请求失败！')
            })
        }
      })
    }
  },
}
</script>
<style lang="less" scoped>
.pt {
  margin-top: 20px;
  // font-size: 16px;
  font-weight: bold;
  padding-top: 20px;
  border-top: 1px dotted #E9E9E9;
}

.item2 {
  // margin-left: 115px;
  margin-bottom: 20px;

  p {
    display: inline-block;
  }

  .box {
    display: inline-block;
    margin-left: 30px;
    margin-right: 20px;
  }
}
</style>
